<template>
  <div id="app">
    <div id="nav">
      <van-tabbar v-model="active" active-color="#ad262f" inactive-color="#848484">
        <van-tabbar-item replace to="/home" icon="wap-home-o">首页</van-tabbar-item>
       <van-tabbar-item replace to="/sort" icon="apps-o">分类</van-tabbar-item>
        <van-tabbar-item replace to="/news" icon="chat-o">消息</van-tabbar-item>
        <van-tabbar-item replace to="/cart" icon="cart-o">购物车</van-tabbar-item>
        <van-tabbar-item replace to="/mine" icon="manager-o">我的</van-tabbar-item>
      </van-tabbar> 
    </div>
    <router-view/>	
  </div>
</template>
<script src="../node_modules/vue/dist/vue.js"></script>
<script>
	export default {
		name:'App',
	  data() {
	    return {
	      active: 0,
	    };
		
	  },
	  //初始化页面选中状态
	   created() {
	   //由于 vant 标签栏路由模式，无法自动加载页面，所以这里需要初始化
	              //console.log(this.$route);//打印当前路由属性
	              if (this.$route.path === '/') {
	                  this.$router.push('/home');
	              }
	          }
	};
</script>
<style lang="less" scoped>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  
}


</style>
